<template>
    <view class="login">
        <login-header @switch-form="handleSwitchForm"></login-header>

        <!-- 动态表单容器 -->
        <view class="form-container">
            <login-from v-if="currentForm === 'login'" @switch-form="handleSwitchForm"></login-from>
            <register-from
                v-else-if="currentForm === 'register'"
                @switch-form="handleSwitchForm"
            ></register-from>
            <forget-password-from v-else @switch-form="handleSwitchForm"></forget-password-from>
        </view>
    </view>
</template>

<script setup>
import loginHeader from './components/header.vue';
import loginFrom from './components/loginFrom.vue';
import registerFrom from './components/registerFrom.vue';
import forgetPasswordFrom from './components/forgetPasswordFrom.vue';

import { ref } from 'vue';

// 当前页面状态
const currentForm = ref('login');

// 处理切换事件
const handleSwitchForm = (type) => {
    currentForm.value = type;
};
</script>

<style lang="scss">
.login {
}
</style>
